<!DOCTYPE html>
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>test.mustache</title>
<meta name="generator" content="KF5::SyntaxHighlighting (Mustache/Handlebars (HTML))"/>
</head><body style="color:#1f1c1b"><pre>
<span style="color:#898887;">&lt;!-- Mustache / Handlebars / Ractive template --&gt;</span>
<span style="color:#0057ae;font-weight:bold;">&lt;!DOCTYPE </span>html<span style="color:#0057ae;font-weight:bold;">&gt;</span>
<span style="font-weight:bold;">&lt;html&gt;</span>
    <span style="font-weight:bold;">&lt;head&gt;</span>
        <span style="font-weight:bold;">&lt;meta</span><span style="color:#006e28;"> charset</span>=<span style="color:#bf0303;">&quot;UTF-8&quot;</span> <span style="font-weight:bold;">/&gt;</span>
        <span style="font-weight:bold;">&lt;title&gt;</span><span style="color:#0057ae;">{{</span>title<span style="color:#0057ae;">}}</span><span style="font-weight:bold;">&lt;/title&gt;</span>
    <span style="font-weight:bold;">&lt;/head&gt;</span>
    <span style="color:#898887;">&lt;!-- CSS --&gt;</span>
    <span style="font-weight:bold;">&lt;style&gt;</span>
        <span style="color:#898887;">/* Mustache variable support in CSS is incomplete */</span>
        <span style="color:#0057ae;">{{</span>mustache<span style="color:#0057ae;">}}</span>
        <span style="color:#0095ff;font-weight:bold;">[ </span><span style="color:#0057ae;">{{</span>other<span style="color:#0057ae;">}}</span><span style="color:#0095ff;font-weight:bold;"> ]</span>
        body {
            <span style="color:#3daee9;">{{{</span>other<span style="color:#3daee9;">}}}</span>
            <span style="font-weight:bold;">font-size</span>: <span style="color:#b08000;">15</span><span style="color:#0057ae;">pt</span>;
            <span style="font-weight:bold;">font-family</span>: Verdana;
        }
    <span style="font-weight:bold;">&lt;/style&gt;</span>
    <span style="color:#898887;">&lt;!-- JavaScript --&gt;</span>
    <span style="font-weight:bold;">&lt;script&gt;</span>
        <span style="font-weight:bold;">var</span> foo = <span style="color:#0057ae;">{{</span>bar<span style="color:#0057ae;">}}</span>;
        <span style="color:#bf0303;">`template </span><span style="color:#0057ae;">{{</span>foo<span style="color:#0057ae;">}}</span><span style="color:#bf0303;"> </span><span style="color:#3daee9;">${</span> <span style="font-weight:bold;">var</span> a = <span style="color:#0057ae;">{{</span>b<span style="color:#0057ae;">}}</span> <span style="color:#3daee9;">}</span><span style="color:#bf0303;">`</span>
    <span style="font-weight:bold;">&lt;/script&gt;</span>

    <span style="font-weight:bold;">&lt;body&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{#movie}}</span>
        <span style="font-weight:bold;">&lt;div&gt;</span>
            <span style="font-weight:bold;">&lt;h1&gt;</span><span style="color:#0057ae;">{{</span>title<span style="color:#0057ae;">}}</span><span style="font-weight:bold;">&lt;/h1&gt;</span>
            <span style="font-weight:bold;">&lt;img</span><span style="color:#006e28;"> src</span>=<span style="color:#bf0303;">&quot;</span><span style="color:#0057ae;">{{</span>poster<span style="color:#0057ae;">}}</span><span style="color:#bf0303;">&quot;</span><span style="color:#006e28;"> alt</span>=<span style="color:#bf0303;">&quot;</span><span style="color:#0057ae;">{{</span>title<span style="color:#0057ae;">}}</span><span style="color:#bf0303;">&quot;</span><span style="font-weight:bold;">/&gt;</span>
        <span style="font-weight:bold;">&lt;/div&gt;</span>
        <span style="font-weight:bold;">&lt;div&gt;</span>
            Rating - <span style="color:#0057ae;">{{</span>ratings.critics_rating<span style="color:#0057ae;">}}</span>
        <span style="font-weight:bold;">&lt;/div&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/movie}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{^movie}}</span>
        <span style="font-weight:bold;">&lt;div&gt;</span>
            Movie Does Not Exist :(
        <span style="font-weight:bold;">&lt;/div&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/movie}}</span>
    <span style="color:#898887;">{{! this is a comment </span><span style="color:#ca9219;background-color:#451e1a;font-weight:bold;">TODO</span><span style="color:#898887;"> </span><span style="color:#e85848;background-color:#451e1a;font-weight:bold;">ALERT</span><span style="color:#898887;"> }}</span>

    This is a partial <span style="color:#0057ae;">{{&gt;</span><span style="color:#924c9d;"> partial1 </span><span style="color:#0057ae;">}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#block</span>
       <span style="color:#006e28;"> param</span>=foo
       <span style="color:#006e28;"> param2</span>=bar<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="color:#0057ae;">{{</span>block<span style="color:#006e28;"> foo</span>=bar<span style="color:#0057ae;">}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{/block}}</span>

    <span style="color:#898887;">&lt;!-- Handlebars --&gt;</span>

    <span style="color:#644a9b;font-weight:bold;">{{#list</span> people<span style="color:#644a9b;font-weight:bold;">}}</span><span style="color:#0057ae;">{{</span>firstName<span style="color:#0057ae;">}}</span> <span style="color:#0057ae;">{{</span>lastName<span style="color:#0057ae;">}}</span><span style="color:#644a9b;font-weight:bold;">{{/list}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#noop}}</span><span style="color:#0057ae;">{{</span>body<span style="color:#0057ae;">}}</span><span style="color:#644a9b;font-weight:bold;">{{/noop}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#with</span> story<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;div</span><span style="color:#006e28;"> class</span>=<span style="color:#bf0303;">&quot;intro&quot;</span><span style="font-weight:bold;">&gt;</span><span style="color:#3daee9;">{{{</span>intro<span style="color:#3daee9;">}}}</span><span style="font-weight:bold;">&lt;/div&gt;</span>
        <span style="font-weight:bold;">&lt;div</span><span style="color:#006e28;"> class</span>=<span style="color:#bf0303;">&quot;body&quot;</span><span style="font-weight:bold;">&gt;</span><span style="color:#3daee9;">{{{</span>body<span style="color:#3daee9;">}}}</span><span style="font-weight:bold;">&lt;/div&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/with}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#each</span> comments<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;div</span><span style="color:#006e28;"> class</span>=<span style="color:#bf0303;">&quot;comment&quot;</span><span style="font-weight:bold;">&gt;</span>
            <span style="font-weight:bold;">&lt;h2&gt;</span><span style="color:#0057ae;">{{</span>subject<span style="color:#0057ae;">}}</span><span style="font-weight:bold;">&lt;/h2&gt;</span>
            <span style="color:#3daee9;">{{{</span>body<span style="color:#3daee9;">}}}</span>
        <span style="font-weight:bold;">&lt;/div&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/each}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#list</span> nav<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;a</span><span style="color:#006e28;"> href</span>=<span style="color:#bf0303;">&quot;</span><span style="color:#0057ae;">{{</span>url<span style="color:#0057ae;">}}</span><span style="color:#bf0303;">&quot;</span><span style="font-weight:bold;">&gt;</span><span style="color:#0057ae;">{{</span>title<span style="color:#0057ae;">}}</span><span style="font-weight:bold;">&lt;/a&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/list}}</span>

    <span style="color:#898887;">{{!-- Conditionals --}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#if</span> isActive<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;img</span><span style="color:#006e28;"> src</span>=<span style="color:#bf0303;">&quot;star.gif&quot;</span><span style="color:#006e28;"> alt</span>=<span style="color:#bf0303;">&quot;Active&quot;</span><span style="font-weight:bold;">&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{else if</span> isInactive<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;img</span><span style="color:#006e28;"> src</span>=<span style="color:#bf0303;">&quot;cry.gif&quot;</span><span style="color:#006e28;"> alt</span>=<span style="color:#bf0303;">&quot;Inactive&quot;</span><span style="font-weight:bold;">&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{else}}</span>
        <span style="font-weight:bold;">&lt;img</span><span style="color:#006e28;"> src</span>=<span style="color:#bf0303;">&quot;cry.gif&quot;</span><span style="color:#006e28;"> alt</span>=<span style="color:#bf0303;">&quot;&quot;</span><span style="font-weight:bold;">&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{/if}}</span>

    <span style="color:#898887;">{{!-- Escaping --}}</span>
    \{{escaped}}
    <span style="color:#644a9b;font-weight:bold;">{{{{raw}}}}</span>
        {{escaped}}
    <span style="color:#644a9b;font-weight:bold;">{{{{/raw}}}}</span>

    <span style="color:#898887;">{{!-- Whitespace Control --}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#each</span> nav ~<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;a</span><span style="color:#006e28;"> href</span>=<span style="color:#bf0303;">&quot;</span><span style="color:#0057ae;">{{</span>url<span style="color:#0057ae;">}}</span><span style="color:#bf0303;">&quot;</span><span style="font-weight:bold;">&gt;</span>
            <span style="color:#644a9b;font-weight:bold;">{{~#if</span> test<span style="color:#644a9b;font-weight:bold;">}}</span>
                <span style="color:#0057ae;">{{</span>~title<span style="color:#0057ae;">}}</span>
            <span style="color:#644a9b;font-weight:bold;">{{~^</span>~<span style="color:#644a9b;font-weight:bold;">}}</span>
                Empty
            <span style="color:#644a9b;font-weight:bold;">{{~/if</span>~<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="font-weight:bold;">&lt;/a&gt;</span>
    <span style="color:#644a9b;font-weight:bold;">{{~/each}}</span>

    <span style="color:#898887;">{{!-- Helpers --}}</span>
    <span style="color:#0057ae;">{{link</span> <span style="color:#bf0303;">&quot;See more...&quot;</span> story.url<span style="color:#0057ae;">}}</span>
    <span style="color:#0057ae;">{{log</span> <span style="color:#bf0303;">&quot;Look at me!&quot;</span><span style="color:#006e28;"> level</span>=<span style="color:#bf0303;">&quot;error&quot;</span><span style="color:#0057ae;">}}</span>

    <span style="color:#898887;">{{!-- Partial --}}</span>
    <span style="color:#0057ae;">{{&gt;</span><span style="color:#924c9d;"> myPartial</span><span style="color:#006e28;"> name</span>=..<span style="color:#924c9d;">/name </span><span style="color:#0057ae;">}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#&gt; myPartial</span> <span style="color:#644a9b;font-weight:bold;">}}</span>
        Failover content
    <span style="color:#644a9b;font-weight:bold;">{{/myPartial}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#*inline</span> <span style="color:#bf0303;">&quot;myPartial&quot;</span><span style="color:#644a9b;font-weight:bold;">}}</span>
        My Content
    <span style="color:#644a9b;font-weight:bold;">{{/inline}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{#each</span> children<span style="color:#644a9b;font-weight:bold;">}}</span>
        <span style="color:#0057ae;">{{&gt;</span><span style="color:#924c9d;"> myPartial</span><span style="color:#0057ae;">}}</span>
    <span style="color:#644a9b;font-weight:bold;">{{/each}}</span>

    <span style="font-weight:bold;">&lt;/body&gt;</span>
<span style="font-weight:bold;">&lt;/html&gt;</span>
</pre></body></html>
